﻿@{
    ResLink.AddCss("~/res/css/zipcode.css");
    ResLink.AddJs("~/res/jquery/js/jquery-ui-1.10.3.custom.min.js");
}

<div id="우편번호대화상자" class="modal hide" tabindex="-1" role="dialog" >
    <div class="modal-header">
        <a class="close" data-dismiss="modal">&times;</a>
        <h1>우편번호 검색</h1>
    </div>

    <div class="modal-body">
        <div class="form-horizontal">
            <span>동:</span>
            <input id="우편번호대화상자_검색패턴" type="text" />
            <button class="btn" onclick='우편번호대화상자_검색()'>검색</button>
        </div>
        <div id="우편번호대화상자_검색결과_박스">
            <div id="우편번호대화상자_검색결과">
            </div>
        </div>            
    </div>

    <div class="modal-footer">
        <a class="btn" data-dismiss="modal">취소</a>
        <a class="btn btn-primary" data-dismiss="modal" onclick="우편번호대화상자_확인()">확인</a>
  </div>
</div>

<script type="text/ecmascript">
    var 우편번호검색버튼;

    function 우편번호검색(btn) {
        우편번호검색버튼 = btn;
        $("#우편번호대화상자").modal('show');
        $("#우편번호대화상자 input[type=text]").focus();
    }

    function 우편번호대화상자_검색() {
        $("#우편번호대화상자_검색결과").load("/ZipCode/Search", { pattern: $("#우편번호대화상자_검색패턴").val() }, OnAjaxLoadComplete).selectable();
    }

    function 우편번호대화상자_확인() {
        var item = $("#우편번호대화상자_검색결과 .ui-selected");
        if (item.length == 0) { alert("항목을 선택하세요"); return; }
        우편번호채우기(item.attr("data-key"), item.find('.주소').html());
    }

    function 우편번호채우기(번호, 주소) {
        var parent = $(우편번호검색버튼).parent();
        parent.find("input[name$=우편번호]").val(번호);

        var input = parent.find("input[name$=주소1]");
        while (input.length <= 0) {
            parent = parent.parent();
            input = parent.find("input[name$=주소1]");
        }
        input.val(주소);
    }
</script>